<!DOCTYPE html>
<meta charset="UTF-8">
<title>Basic Messager - jQuery AgileUI Demo</title>
<h2>消息弹出动画</h2>
<div style="margin: 10px 0;">
	<a href="#" data-type="button" onclick="show()">显示</a>
	<a href="#" data-type="button" onclick="slide()">滑出</a>
	<a href="#" data-type="button" onclick="fade()">渐变</a>
	<a href="#" data-type="button" onclick="progress()">操作中</a>
</div>
<script type="text/javascript">
    function show() {
	    $.messager.show({
	        title : '系统提示',
	        msg : '这个消息将要被关闭.',
	        showType : 'show'
	    });
    }
    function slide() {
	    $.messager.show({
	        title : '系统提示',
	        msg : '这个消息将要在5秒后被关闭.',
	        timeout : 5000,
	        showType : 'slide'
	    });
    }
    function fade() {
	    $.messager.show({
	        title : '系统提示',
	        msg : '不会被自动关闭.',
	        timeout : 0,
	        showType : 'fade'
	    });
    }
    function progress() {
	    var win = $.messager.progress({
	        title : '系统提示',
	        msg : '正在运算,请稍后...'
	    });
	    setTimeout(function() {
		    $.messager.progress('close');
	    }, 5000)
    }
</script>
